<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
	<title>分组信息浏览</title>
	<!--增加easyui组件的引入，否则rowIsNull函数一直报undefiend错误
	<script src="/static/easyui/jeasyui-extensions/jeasyui.extensions.ty.js" type="text/javascript"></script>-->
    <script src="static/easyui/jeasyui-extensions/jeasyui.extensions.ty.js" type="text/javascript"></script>
	<link rel="stylesheet" type="text/css" href="static/easyui/jquery-easyui-theme/default/easyui.css">
	<link rel="stylesheet" type="text/css" href="static/easyui/jquery-easyui-theme/icon.css">
	<link rel="stylesheet" type="text/css" href="static/easyui/icons/icon-all.css">	
	<script type="text/javascript" src="static/easyui/jquery/jquery-1.11.1.min.js"></script>
	<script type="text/javascript" src="static/easyui/jquery-easyui-1.3.6/jquery.easyui.min.js"></script>
  </head>
  <body style="font-family: '微软雅黑';margin:15px 10px;height: 97%"  class="easyui-layout">
  <div data-options="region:'north',title:'操作',split:true" style="height:80px;padding:5px 0;">
    <div style="padding-top: 10px">
        <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="add();">点击分组</a>
        <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-remove" plain="true" onclick="del()">删除分组</a>
        <a href="javascript:void(0)" class="easyui-linkbutton search" plain="true" iconCls="icon-search" onclick="javascript:$('#showDialog').dialog('open')">查询</a>
    </div>
</div>
<div data-options="region:'center',title:'用户查询结果'" style="padding:5px;background:#eee;">
    <table id="dg"></table>
    <div id="dlg"></div>
    <table id="totalTb"></table>
</div>

<div id="showDialog" class="easyui-dialog" title="分组查询" style="width:400px;height:200px;padding:10px"
     toolbar="#dlg-toolbar" buttons="#dlg-buttons" closed="true">
    <form id="searchFrom">
        <table>
        <tr>
                <td>
                    id：
                </td>
                <td>
                    <input type="text" id="id1" name="id1" class="easyui-validatebox"
                           data-options="width:150"/>
                </td>
            </tr>
            <tr>
                <td>
                    组名：
                </td>
                <td>
                    <input type="text" id="groupId" name="groupId" class="easyui-validatebox"
                           data-options="width:150"/>
                </td>
            </tr>
            <tr>
                <td>
                    描述信息：
                </td>
                <td>
                    <input type="text" id="description" name="description" class="easyui-validatebox"
                           data-options="width:150"/>
                </td>
            </tr>
        </table>
        <div id="dlg-buttons">
            <table cellpadding="0" cellspacing="0" style="width:100%">
                <tr>
                    <td style="text-align:right">
                        <a id="query" href="#" class="easyui-linkbutton query" iconCls="icon-search" onclick="cx()">查询</a>
                        <a href="#" class="easyui-linkbutton" iconCls="icon-cancel" onclick="javascript:$('#showDialog').dialog('close')">取消</a>
                    </td>
                </tr>
            </table>
        </div>
    </form>
</div>
<div id="inputDialog" class="easyui-dialog" title="配置分组参数" style="width:400px;height:200px;padding:10px"
     toolbar="#dlg-toolbar" buttons="#dlg-buttons" closed="true">
    <form id="mainform">
        <table class="formTable">
            <tr style="line-height:80px">
                <td></td>
            </tr>
            <tr>
                <td>分组方式：</td>
                <td>
                <select id="type" name="type" style="width:150px;">
                    <option value="2" >随机分组</option>
                </select>
                </td>
            </tr>
            <tr>
                <td>组数：</td>             
                <td><input id="num" name="num" type="text" value="" class="easyui-validatebox"
                           required="required"/></td>
            </tr>
        </table>
        <div id="dlg-buttons">
            <table cellpadding="0" cellspacing="0" style="width:100%">
                <tr>
                    <td style="text-align:right">
                        <a id="input" href="#" class="easyui-linkbutton input" iconCls="icon-add" onclick="group()">生成分组</a>
                        <a href="#" class="easyui-linkbutton" iconCls="icon-cancel" onclick="javascript:$('#inputDialog').dialog('close')">取消</a>
                    </td>
                </tr>
            </table>
        </div>
    </form>
</div>
<script type="text/javascript">
    var dg;
    $(function () {
        dg = $('#dg').datagrid({
            method: 'post',
            url: '/basketballManage/arrangeGroup/json',
            fit: true,
            fitColumns: true,
            border: false,
            loadMsg:'数据加载中，请稍等！',
            striped: true,
            idField: 'id',
            singleSelect:true,
            collapsible:true,
            pagination: true,
            rownumbers: true,
            pageNumber: 1,
            pageSize: 5,
            pageList: [5, 10, 20, 30, 40],
            singleSelect: true,
            autoRowHeight: true,
            columns: [[
                {field: 'id', title: 'id'},
                {field: 'teamId', title: '队id', sortable: true, width: 100,},
                {field: 'groupId', title: '组id', sortable: true, width: 100,},
                {field: 'description', title: '描述', sortable: true, width: 300}
            ]],
            toolbar: '#toolbar'
        });
        $($('#dg').datagrid('getPager')).pagination({
                beforePageText: '第',//页数文本框前显示的汉字  
                afterPageText: '页    共 {pages} 页',
                displayMsg: '当前显示 {from} - {to} 条记录   共 {total} 条记录',
     });
    });
    



    //弹窗增加
    function add() {
        parent.$.messager.show('提示', '请选择分组算法，请输入分为几组');
        $('#inputDialog').dialog('open');
    }
    //分组
    function group() {
        //var obj = $("#searchFrom").serializeObject();
        var type = $("#type").val();
        var num = $("#num").val();
        parent.$.messager.confirm('提示', '确定生成分组？'+'--分组方式为:'+type+'--分组数量:'+num, function (data) {
            if (data) {
                $.ajax({
                    type: 'post',
                    url: "/basketballManage/arrangeGroup/create?num="+num,                   
                    success: function (data) {
                    alert(data);
                    $('#inputDialog').dialog('close');
                    dg.datagrid("reload");
                    }
                });
            }
        });
        $('#inputDialog').dialog('close');
        $("#num").val("");
    }



    //删除
    function del() {
        parent.$.messager.confirm('提示', '删除后无法恢复您确定要删除？', function (data) {
            if (data) {
                $.ajax({
                    type: 'get',
                    url: "/basketballManage/arrangeGroup/delete",                   
                    success: function (data) {
                    //alert(data);
                     parent.$.messager.show({ title : "提示",msg: "删除成功！", position: "bottomRight" });
                     dg.datagrid("reload");
                    }
                });
            }
        });
    }
    

    //创建查询对象并查询
    function cx() {
        //var obj = $("#searchFrom").serializeObject();
        dg.datagrid('reload', {
            "id1": $("#id1").val(),
            "groupId":$("#groupId").val(),
            "description": $("#description").val()
        });
        $('#showDialog').dialog('close');
        $("#id1").val("")
        $("#groupId").val("");
        $("#description").val("");
    }

</script>  
  </body>
</html>
